<div class="tableform">
  <div class="tip-text">
  <h2 class="font14px">清风设计团队 —— 商派认证模板服务商，专业品质，为电商助力!</h2>
  <p>数百款精品模板及应用尽在清风设计，不断更新。<a href="http://www.hnqss.cn/html/jszx/" target="_blank">技术研究</a>&nbsp;&nbsp;<a href="http://www.hnqss.cn/html/business/" target="_blank">网店运营</a>&nbsp;&nbsp;<a href="http://www.hnqss.cn/help/" target="_blank">使用帮助</a>&nbsp;&nbsp;<a href="http://www.hnqss.cn/fwtc/" target="_blank">代维服务</a>，最新电商资源，请点击进入<a href="http://www.hnqss.cn/" target="_blank">清风设计官网</a>，服务QQ：800060659</p>
    <p>
    <span>点击进入模板专区：</span>
    <a href="http://www.hnqss.cn/moban/ecstore/" target="_blank">1.ECStore模板</a>&nbsp;&nbsp;
    <a href="http://www.hnqss.cn/moban/ykd/" target="_blank">2.易开店模板</a>&nbsp;&nbsp;
    <a href="http://www.hnqss.cn/moban/shopex/" target="_blank">3.ShopEx模板</a>&nbsp;&nbsp;
    <a href="http://www.hnqss.cn/moban/fxw/" target="_blank">4.分销王模板</a>&nbsp;&nbsp;
    <a href="http://www.hnqss.cn/Mobile/" target="_blank">5.手机端模板</a>&nbsp;&nbsp;
    <a href="http://www.hnqss.cn/downloads/mfmb/" target="_blank">6.免费模板</a>
    </p>
    <p><span>点击进入应用专区：</span>
    <a href="http://www.hnqss.cn/tools/" target="_blank">1.插件中心</a>&nbsp;&nbsp;
    <a href="http://www.hnqss.cn/html/ECStore/" target="_blank">2.挂件中心</a>&nbsp;&nbsp;
    <a href="http://www.hnqss.cn/downloads/mfcj/" target="_blank">6.免费应用</a>
    </p>
  </div>
</div>

<div class="tableform">
  <h4>基本设置： <i>在不清楚下面设置的作用的情况下，请勿随意改动参数设置，以免样式混乱!</i></h4>
  <div class="widgetconfig division">    
    <table width="100%" cellpadding="0" cellspacing="0">
     <tr>
     	<th><{t app='b2c'}>栏目标题：<{/t}></th>
        <td><input type="text" name="title" value="<{$setting.title}>" class="inputstyle" style="width:100px;">&nbsp;<em>留空则不显示</em></td>
        <th>样式名：</th>
        <td><input type="text" name="stylename" value="<{$setting.stylename}>" class="inputstyle" />&nbsp;(需启用外层div，可不填)</td>
        <td>启用外层div：<input type="checkbox" name="showtag" value="1" <{if $setting.showtag=="1"}> checked="checked"<{/if}>></td>
     </tr>
     <tr>
      	<th><{t app='b2c'}>排列方式：<{/t}></th>
        <td><input type="radio" name="type" value="0" <{if $setting.type!=1 && $setting.type!=2}>checked="checked"<{/if}>><{t app='b2c'}>默认<{/t}>&nbsp;&nbsp;<input type="radio" name="type" value="1" <{if $setting.type==1}>checked="checked"<{/if}>>左右浮动&nbsp;&nbsp;<input type="radio" name="type" value="2" <{if $setting.type==2}>checked="checked"<{/if}>>滚动展示</td>
         <th><{t app='b2c'}>图片间隔：<{/t}></th>         
         <td><input type="text" name="ad_margin" class="inputstyle" value="<{$setting.ad_margin}>"> px</td>
         <td>在图片下显示描述：<input type="checkbox" name="showtxt" value="1" <{if $setting.showtxt=="1"}> checked="checked"<{/if}>></td>
      </tr>
    </table>
    </div>
</div>  
  
<div class="tableform" id="type-view"<{if $setting.type != "2"}> style="display:none"<{/if}>>
   	<h4>滚动设置:</h4>
    <div class="widgetconfig division">
     <table cellpadding="0" cellspacing="0" width="100%">
          <tr>
            <th width="20%">滚动方向</th>
            <td width="30%">
            	<select name="effect" id="effect">
                	<option value="scrollx" <{if $setting.effect=="scrollx"}> selected="selected"<{/if}>>左右滚动</option>
                    <option value="scrolly" <{if $setting.effect=="scrolly"}> selected="selected"<{/if}>>上下滚动</option>
                    <!--option value="fade" <{if $setting.effect=="fade"}> selected="selected"<{/if}>>淡入淡出</option-->
                </select>
             </td>
            <th width="20%"></th>
            <td width="30%"></td>
          </tr>
          <tr>
            <th width="20%">滚动区显示尺寸：</th>
            <td width="30%">宽：<input type="text" name="ad_width" value="<{$setting.ad_width}>" class="inputstyle"  style="width:40px">px&nbsp;高:<input type="text" name="ad_height" value="<{$setting.ad_height}>" class="inputstyle"  style="width:40px">px </td>
            <th width="20%">每屏显示数量</th>
            <td width="30%"><input type="text" name="viewnum" vtype="required" value="<{$setting.viewnum|default:'1'}>" class="inputstyle">&nbsp;个</td>
          </tr>
        </table>
     </div>
</div>
    
<div class="tableform">
	<h4>图片设置：</h4>
  	<div class="widgetconfig">
      <div class="clearfix"><{button label=$___b2c="添加图片广告"|t:'b2c' app="desktop" icon="btn_add.gif" id="add_ad_pic"}></div> 
      <div id="ad">
      <{foreach from=$setting.ad item=data key=key}>
        <div class="division configad">
          <table width="100%" cellpadding="0" cellspacing="0">
            <input type="hidden" name="ad[<{$data.i}>][i]" value="<{$data.i}>">
            <tr>
              <th width="10%">图片：</th>
              <td width="50%"><input type="text" style="width:80%" class="imgsrc inputstyle" name="ad[<{$data.i}>][pic]" id="ad[<{$data.i}>][pic]" value="<{$data.pic}>" /><input type="button" value="上传图片" onclick="addPic($('ad[<{$data.i}>][pic]'))" /></td>
             <th width="10%">尺寸：</th>
             <td width="25%">宽：<input type="text" name="ad[<{$data.i}>][width]" value="<{$data.width}>" class="inputstyle"  style="width:40px">px&nbsp;高:<input type="text" name="ad[<{$data.i}>][height]" value="<{$data.height}>" class="inputstyle"  style="width:40px">px </td>
            <td style="width:30px"><span onclick="delLink(this);" class="opt"><{img src="bundle/delecate.gif" title="删除" app="desktop"}></span></td>
            </tr>
            <tr>
              <th width="10%">链接：</th>
              <td width="50%"><input type="text" style="width:95%" name="ad[<{$data.i}>][url]" value="<{$data.url}>" class="inputstyle"></td>
              <th width="10%">描述：</th>
              <td width="25%"><input type="text" style="width:95%" name="ad[<{$data.i}>][title]" value="<{$data.title}>" class="inputstyle"></td>
              <td></td>
            </tr>
          </table>
        </div>
        <{/foreach}>
        </div>
    </div>
</div>

<script>
function setToggler(togglers){
  togglers.each(function(toggler){
    var view = toggler.getProperty('name')+'-view';
    toggler.addEvent('click',function(){
      if(this.value=="2"){
        $(view).show();
      }else{
        $(view).hide();
      }
    });
  });
}

var togglers = $$('input[name="type"]');
setToggler(togglers);

$('add_ad_pic').addEvent('click',function(){
  var d=new Date();
  var i=d.getTime();
  $('ad').adopt(new Element('div').set('html','\
    <div class="division configad">\
	   <input type="hidden" name="ad['+i+'][i]" value="'+i+'">\
       <table cellpadding="0" cellspacing="0" width="100%">\
         <tr><th width="10%">图片：</th><td width="50%"><input type="text" style="width:80%" class="imgsrc inputstyle" name=ad['+i+'][pic] id="ad['+i+'][pic]" value="%THEME%/images/"><input type="button" value="上传图片" onClick="addPic($(\'ad['+i+'][pic]\'))"></td>\
		 <th width="10%">尺寸：</th><td width="25%">宽<input type="text" class="inputstyle" name="ad['+i+'][width]" style="width:40px">px&nbsp;&nbsp;高<input type="text" class="inputstyle" name="ad['+i+'][height]"  style="width:40px">px</td>\
		 <td style="width:30px"><span onclick="delLink(this)" class="opt"><{img src="bundle/delecate.gif" style="cursor:pointer;" title="删除" app="desktop"}></span></td></tr>\
          <tr><th width="10%">链接：</th><td width="50%"><input type="text" style="width:95%" name="ad['+i+'][url]" class="inputstyle"></td>\
		  <th width="10%">描述：</th><td width="25%"><input type="text" style="width:95%" name="ad['+i+'][title]" class="inputstyle"></td><td></td></tr>\
       </table>\
    </div>\
  ').getFirst());
	$('pic['+i+']').addEvent('click',function(e){bindevent(this)});
});

function addPic(target){
	var url='index.php?app=desktop&act=alertpages&goto='+encodeURIComponent("index.php?app=image&ctl=admin_manage&act=image_broswer&type=big");
	Ex_Loader('modedialog',function(){
		return new imgDialog(url,{onCallback:function(image_id,image_src){
				$(target).value=image_src;
		}})	;
	});
}
delLink=function(o){$(o).getParent('.configad').remove();}
</script>